<!-- 保修单 -->
<template>
  <div>
    <van-form @submit="onSubmit">
      <van-field
        v-model="form.a"
        name="保修设备"
        label="保修设备"
        placeholder="保修设备"
      />
      <van-field
        v-model="form.b"
        name="设备故障"
        label="设备故障"
        placeholder="设备故障"
      />
      <van-field
        v-model="form.c"
        name="维修建议/方案"
        label="维修建议/方案"
        placeholder="维修建议/方案"
      />
      <van-field
        v-model="form.d"
        name="维修费用"
        label="维修费用"
        placeholder="维修费用"
      />
      <van-field
        v-model="form.e"
        name="报修人"
        label="报修人"
        placeholder="报修人"
      />
      <div class="conctrol">
        <van-uploader :after-read="afterRead" />
        <van-uploader>
          <van-button icon="plus" type="primary">点击上传附件</van-button>
        </van-uploader>
      </div>
      <van-button style="width:80%;margin:0 auto;margin-top:20px" type="info" block>提交</van-button>
    </van-form>
  </div>
</template>

<script>
import { Form, Field, Uploader, Button } from 'vant'
import 'vant/lib/button/style'
export default {
  data () {
    return {
      form: {}
    }
  },

  components: {
    [Form.name]: Form,
    [Field.name]: Field,
    [Uploader.name]: Uploader,
    [Button.name]: Button
  },

  computed: {},

  methods: {
    afterRead (file) {
      console.log(file)
    },
    onSubmit () {}
  }
}
</script>
<style lang='less' scoped>
  .conctrol {
    display: flex;
    flex-direction: column;
    margin-top: 10px;
  }
</style>
